<template>
	<view class="bindMailbox">
		<view class="" style="width: 190rpx;margin: 0 auto;">
			<image src="../../static/image/logo.png" mode="" style="width: 190rpx;height: 190rpx;border-radius: 100rpx;"></image>
		</view>

		<view class="inputBox">
			<u--input placeholder="请输入邮箱号" v-model="email" border="bottom" clearable></u--input>
		</view>
		<view class="inputBox" style="margin-top: 20rpx;">
			<u--input class="inputitem" v-model="code" placeholder="请输入验证码" border="bottom" clearable></u--input>
			<view v-if="codeFlag" class="ysm" @click="handleSendcode">
				获取验证码
			</view>
			<view v-else class="ysm">
				{{time}}s
			</view>
		</view>
		<view class="inputBox" style="margin-top: 20rpx;">
			<u--input placeholder="请输入新密码" type="password" v-model="password" border="bottom" clearable></u--input>
		</view>
		<view class="inputBox" style="margin-top: 20rpx;">
			<u--input placeholder="请确认密码" type="password" v-model="password1" border="bottom" clearable></u--input>
		</view>

		<view class="btns" @click="handleBindemail">
			确认修改
		</view>
	<!-- 	<view class="jump" @click="handleJump">
			返回首页
		</view> -->

	</view>
</template>

<script>
	import {
		resetpassword,emailSend
	} from "@/api/api.js"
	export default {
		data() {
			return {
				email: "",
				code: "",
				codeFlag: true,
				time: 60,
				password:"",
				password1:"",
			}
		},
		onLoad() {

		},
		methods: {
			async handleSendcode() {
				const that = this 
				if (that.email == "") {
					uni.showToast({
						title: '请输入邮箱地址！',
						icon: "none",
						duration: 2000
					});
					return
				}
				let res = await emailSend({
					email: that.email
				})
				// console.log("1",res)
				let regex = /\{(.+?)\}/g;
				let matches = res.match(regex);
				// console.log("matches",matches)
				matches = JSON.parse(matches[0])
				if (matches.code == 1000) {
					// ['{sample}', '{placeholders}']
					uni.showToast({
						title: matches.message,
						icon: "none",
						duration: 2000
					});
					that.codeFlag = false
					const interval = setInterval(function() {
						if ((that.time--) <= 0) {
							that.time = 60
							that.codeFlag = true
							clearInterval(interval)
						}
					}, 1000)
				} else {
					uni.showToast({
						title: matches.message,
						icon: "none",
						duration: 2000
					});
				}


			},
			async handleBindemail() {
				if (this.code == "") {
					uni.showToast({
						title: '请输入验证码！',
						icon: "none",
						duration: 2000
					});
					return
				}
				if (this.password == "") {
					uni.showToast({
						title: '请输入密码！',
						icon: "none",
						duration: 2000
					});
					return
				}
				if (this.password1 == "") {
					uni.showToast({
						title: '请输入确认密码！',
						icon: "none",
						duration: 2000
					});
					return
				}
				if (this.password != this.password1) {
					uni.showToast({
						title: '请确认新密码和确认密码输入一致！',
						icon: "none",
						duration: 2000
					});
					return
				}
				
				let res = await resetpassword({
					email: this.email,
					code: this.code,
					password:this.password,
					password1:this.password1
				})
				if (res.code == 1000) {
					uni.removeStorageSync("token")
					uni.showToast({
						title: res.message+"请重新登录！",
						icon: "none",
						duration: 1800
					});
					setTimeout(() => {
						uni.reLaunch({
							url: "/pages/login/bindMailbox"
						})
					}, 2000)
				} else {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 2000
					});
				}
			},
			handleJump() {
				uni.switchTab({
					url: "/pages/home/index"
				})
			},
			leftClick() {

			},
		}
	}
</script>

<style scoped lang="scss">
	.bindMailbox {
		width: 100%;
		height: 100%;
		background-color: #ffffff;

		.inputBox {
			width: 638rpx;
			margin: 0 auto;
			margin-top: 176rpx;
			position: relative;

			.ysm {
				width: 200rpx;
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #255A9B;
				line-height: 24rpx;
				position: absolute;
				right: -50rpx;
				top: 20rpx;
				z-index: 999;
			}

		}

		.btns {
			width: 622rpx;
			height: 88rpx;
			background: #255A9B;
			border-radius: 200rpx 200rpx 200rpx 200rpx;
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 88rpx;
			text-align: center;
			margin: 0 auto;
			margin-top: 66rpx;
		}

		.jump {
			width: 148rpx;
			height: 36rpx;
			font-size: 30rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #255A9B;
			line-height: 36rpx;
			margin: 0 auto;
			margin-top: 40rpx;
			text-align: center;
		}
	}
</style>